<template>
    <div>
         <el-carousel indicator-position="outside" height="460px">
          <el-carousel-item v-for="item in scarousel" :key="item.scarousel_id">
            <img :src="'api/'+item.imgPath" alt />
          </el-carousel-item>
        </el-carousel>
    </div>
</template>
<script>
import Api from "../api/homeApi";
export default {
  data() {
    return {
      scarousel: {}
    };
  },
  created() {
    this.getScarousels();
  },
  methods: {
    async getScarousels() {
      let res = await Api.getCarousel();
      this.scarousel = res.carousel;
      console.log(this.scarousel);
    }
  }
};
</script>
<style lang="scss" scoped>
     .el-container:nth-child(5) .el-aside,
.el-container:nth-child(6) .el-aside {
  line-height: 260px;
}

.el-container:nth-child(7) .el-aside {
  line-height: 320px;
}
</style>